.xl-field-module {
  width: 100%;
  padding: 0;
  overflow: hidden;
  position: relative;
  background-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 8px rgba(78, 124, 200, 0.2);
  margin-bottom: 8px;
  border-radius: 8px 8px;
  .xl-field-content {
    position: relative;
    padding: 10px;
  }
}
.h-title{
  color: #333333;
  font-size: 16px;
  font-weight: 500;
}
.xl-form {
  position: relative;
  display: inline-block;
  width: 100%;
  min-height: 100%;
  padding: 5px 10px;
  font-size: 3.4vw;
  .xl-form-content {
    line-height: 21px;
    position: relative;
    font-size: inherit;
    word-break: break-all;
  }

  .xl-textarea {
    position: relative;
    display: inline-block;
    width: 100%;
    vertical-align: bottom;
    font-size: inherit;
  }

  .xl-textarea-inner {
    display: block;
    resize: vertical;
    padding: 5px 15px;
    line-height: 1.5;
    box-sizing: border-box;
    width: 100%;
    font-size: inherit;
    color: #606266;
    background-color: #fff;
    background-image: none;
    border: 1px solid #dcdfe6;
    border-radius: 4px;
    transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
  }
  .xl-text {
    position: relative;
    font-size: inherit;
    display: inline-block;
    width: 100%;
    word-wrap: break-word;

    > * {
      -webkit-appearance: none;
      background-color: #fff;
      background-image: none;
      border-radius: 4px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      color: #606266;
      display: inline-block;
      font-size: inherit;
      min-height: 21px;
      line-height: 21px;
      outline: none;
      -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
      width: 100%;
      padding: 0 5px 5px 15px;
      white-space: pre-line;
      word-wrap: break-word;
    }

  }

  .xl-form-item {
    margin-bottom: 5px;
    position: relative;
    display: inline-block;
  }

  .colon {
    font-style: normal;
    padding: 0 4px;
  }

  .xl-label {
    margin-bottom: 0;
    text-align: right;
    display: inline-block;
    vertical-align: middle;
    font-family: '微软雅黑', sans-serif;
    color: #AAAAAA;
    float: left;
    font-size: inherit;
    line-height: 21px;
    padding: 0 12px 0 0;
    box-sizing: border-box;
    position: relative;
  }
}

.change-show{
  padding: 10px 0;
  text-align: center;
}

.word-blue-color{
  color: #216ab7;
}

.word-black-color {
  color: #8f8f94;
}
.word-red-color {
  color: #F21213;
}
.word-green-color {
  color: green;
}
.word-yellow-color {
  color: #f4d006;
}
.blue-bg-color{
  color: #216ab7;
  background: #216ab726;
}
.black-bg-color{
  color: #8f8f94;
  background: #8f8f9424;
}
.approved-text{
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  padding: 4px 15px;
  line-height: 26px;
  border-radius: 14px;
}
.notice-num{
  position: absolute;
  line-height: 1;
  transform: translate(-6px, 5px);
}
.total-num{
  background-color: #fa2c19;
  border-radius: 14px;
  font-size: 12px;
  padding: 0 5px;
  color: #FFF;
  font-style: inherit;
  margin-left: 5px;
  font-weight: 100;
  font-family: inherit;
}
.el-message-box{
  width: 300px;
}
